import React, { useContext, useEffect, useState } from 'react';
import { Button, Form, Input, Popover, Select, Space } from 'antd';
import { DisconnectOutlined } from '@ant-design/icons';
import { ConfigsContext } from '../..';
export function LinkSet(props) {
  var namepath = props.namepath,
    targetType = props.targetType;
  var _a = useContext(ConfigsContext),
    activeSchema = _a.activeSchema,
    schemaListOptions = _a.schemaListOptions;
  var needDefineGetterProps = activeSchema.current.needDefineGetterProps;
  var key = namepath.join();
  var getterInfo = needDefineGetterProps[key];
  var form = Form.useForm()[0];
  var _b = useState(false),
    visible = _b[0],
    setVisible = _b[1];
  var _c = useState(false),
    isLinked = _c[0],
    setIsLinked = _c[1];
  var _d = useState(''),
    resultText = _d[0],
    setResultText = _d[1];
  var _e = useState(true),
    disabled = _e[0],
    setDisabled = _e[1];
  var _f = useState(
      (getterInfo === null || getterInfo === void 0 ? void 0 : getterInfo.observedStringedName) ===
        'publicStates'
    ),
    isFromPublicStates = _f[0],
    setIsFromPublicStates = _f[1];
  var setText = function (getterInfo) {
    var _a = getterInfo || {},
      observedStringedName = _a.observedStringedName,
      publicStateKey = _a.publicStateKey,
      rule = _a.rule,
      reference = _a.reference;
    if (!observedStringedName) {
      setResultText('');
      setDisabled(true);
      return;
    }
    var newText = '';
    if (observedStringedName === 'publicStates') {
      newText = 'publicStates['
        .concat(publicStateKey, '] \u6216 publicStates[')
        .concat(publicStateKey, ']()');
    } else {
      switch (targetType) {
        case 'boolean':
          newText = 'Boolean('.concat(observedStringedName, '.value)');
          break;
        case 'number':
          newText = 'Number('.concat(observedStringedName, '.value)');
          break;
        default:
          newText = ''.concat(observedStringedName, '.value?.toString()');
      }
    }
    if (rule && reference) {
      newText = ''
        .concat(observedStringedName, '.value?.toString() ')
        .concat(rule, ' "')
        .concat(reference, '"');
    }
    if (rule === '!') {
      newText = '!('.concat(newText, ')');
    }
    setIsFromPublicStates(observedStringedName === 'publicStates');
    setResultText(newText);
    setDisabled(false);
  };
  var onFinish = function () {
    form.validateFields().then(function (values) {
      var observedStringedName = values.observedStringedName,
        publicStateKey = values.publicStateKey,
        rule = values.rule,
        reference = values.reference;
      var getterInfo = {
        observedStringedName: observedStringedName,
        publicStateKey: publicStateKey,
        namepath: namepath,
        reference: reference,
        rule: rule
      };
      needDefineGetterProps[key] = getterInfo;
      setVisible(false);
    });
  };
  var onCancel = function () {
    delete needDefineGetterProps[key];
    setVisible(false);
  };
  useEffect(
    function () {
      if (!visible) {
        setIsLinked(!!getterInfo);
      } else {
        getterInfo ? form.setFieldsValue(getterInfo) : form.resetFields();
        setText(getterInfo);
      }
    },
    [visible]
  );
  return React.createElement(
    Popover,
    {
      placement: 'topLeft',
      trigger: 'click',
      title: '\u8BBE\u7F6E\u5173\u8054\u503C',
      visible: visible,
      onVisibleChange: setVisible,
      content: React.createElement(
        'div',
        null,
        React.createElement(
          Form,
          {
            form: form,
            onValuesChange: function (_, allValues) {
              return setText(allValues);
            }
          },
          React.createElement(
            Form.Item,
            { label: '\u5173\u8054\u5BF9\u8C61', name: 'observedStringedName', required: true },
            React.createElement(Select, { options: schemaListOptions })
          ),
          isFromPublicStates &&
            React.createElement(
              Form.Item,
              {
                label: '\u516C\u5171\u72B6\u6001key\u540D',
                name: 'publicStateKey',
                required: true
              },
              React.createElement(Input, null)
            ),
          React.createElement(
            Form.Item,
            { label: '\u8BA1\u7B97\u89C4\u5219', name: 'rule' },
            React.createElement(
              Select,
              null,
              React.createElement(Select.Option, { value: '!' }, '!\u5173\u8054\u503C\u53D6\u53CD'),
              React.createElement(
                Select.Option,
                { value: '<' },
                '\u5173\u8054\u503C < \u53C2\u8003\u503C'
              ),
              React.createElement(
                Select.Option,
                { value: '<=' },
                '\u5173\u8054\u503C \u2264 \u53C2\u8003\u503C'
              ),
              React.createElement(
                Select.Option,
                { value: '===' },
                '\u5173\u8054\u503C === \u53C2\u8003\u503C'
              ),
              React.createElement(
                Select.Option,
                { value: '!==' },
                '\u5173\u8054\u503C !== \u53C2\u8003\u503C'
              ),
              React.createElement(
                Select.Option,
                { value: '>=' },
                '\u5173\u8054\u503C \u2265 \u53C2\u8003\u503C'
              ),
              React.createElement(
                Select.Option,
                { value: '>' },
                '\u5173\u8054\u503C > \u53C2\u8003\u503C'
              )
            )
          ),
          React.createElement(
            Form.Item,
            { label: '\u53C2\u8003\u503C', name: 'reference' },
            React.createElement(Input, {
              prefix: '"',
              suffix: '"',
              placeholder: '\u53C2\u8003\u503C'
            })
          ),
          React.createElement(
            Form.Item,
            { label: '\u5173\u8054\u7ED3\u679C\uFF1A' },
            React.createElement('div', null, resultText)
          )
        ),
        React.createElement(
          Space,
          null,
          React.createElement(
            Button,
            { disabled: disabled, onClick: onFinish, type: 'primary' },
            '\u786E\u5B9A'
          ),
          React.createElement(
            Button,
            { disabled: disabled, onClick: onCancel, danger: true },
            '\u5220\u9664\u5173\u8054'
          )
        )
      )
    },
    React.createElement(Button, {
      type: isLinked ? 'link' : 'text',
      icon: React.createElement(DisconnectOutlined, null)
    })
  );
}
